簡介

CSS 是 Cascading Style Sheets（層疊樣式表）的簡稱。
是一種標記語言，不需要編譯，可以直接由瀏覽器執行（屬於瀏覽器解釋型語言）。

• CSS 的作用
  CSS 能夠使你的網頁更整齊，它可控制網頁中的字型.字體.大小.連結.表格.圖片....等。
• CSS 的工作原理
  每個 html 元素都有一組樣式屬性，可以通過 css 來設定。
  當 html 元素的同一個樣式屬性有多種樣式值的時候，css 就要靠層疊機智來決定最終應用哪種樣式。
• 規則、屬性和值

• 常用選擇器

顏色 (color)

• 如何指定顏色 color:顏色名稱或色碼
• 顏色術語和顏色對比
• 背景色 background-color

文本 (text / font)

• 文本的大小和字型 (font-size / font-family)

• 粗細、樣式、拉伸和裝飾 (font-weight / font-style / font-stretch / text-decoration)

• 行間距 (line-height)、字母間距 (letter-spacing) 和單詞間距 (word-spacing)
• 對齊 (text-align) 方式和縮進 (text-ident)
• 鏈接樣式 (:link / :visited / :active / :hover)
• CSS3新屬性
  • 陰影效果- text-shadow
  • 首字母和首行文本 (:first-letter / :first-line)
  • 響應用戶

盒子 (box model)

• 盒子大小的控制 (width / height)

• 盒子的邊框、外邊距和內邊距 (border / margin / padding)

• 盒子的顯示和隱藏(display / visibility)
• CSS3新屬性
  • 邊框圖像 (border-image)
  • 投影 (border-shadow)
  • 圓角 (border-radius)

列表、表格和表單

• 列表的項目符號 (list-style)
• 表格的邊框和背景 (border-collapse)
• 表單控件的外觀
• 表單控件的對齊
• 瀏覽器的開發者工具

圖像

• 控製圖像的大小 (display: inline-block)
• 對齊圖像
• 背景圖像 (background / background-image / background-repeat / background-position)

佈局

• 控制元素的位置 (position / z-index)
  • 普通流
  • 相對定位
  • 絕對定位
  • 固定定位
  • 浮動元素 (float / clear)

網站佈局

• HTML5布局

• 適配屏幕尺寸
  • 固定寬度佈局
  • 流體佈局
  • 佈局網格

上面都只是純文字敘述，如果想要更了解該如何使用，建議到這個網站CSS教程有教學可以練習，我自己是邊看邊學。